<template>
  <div>
    <el-tag v-for="(key, index) in this.valuesOfprompt" :key="index" class="item">
      {{ this.exportPrompts[index] }}: {{ key }}
    </el-tag>
  </div>
</template>

<script>
import { ExportPrompt } from "@/utils/constValues.js";
import { http } from "@/utils/requests";


export default {
  name: "XionganText",
  data() {
    return {
      valuesOfprompt: [],
      exportPrompts: ExportPrompt
    }
  },
  props: {
    year: {
      type: Number,
      default: 2020
    },
    country: {
      type: String,
      default: "安新县"
    }
  },
  mounted() {
    this.httpRequest({});
  },
  methods: {
    httpRequest(params) {
      const url = "/api/yearCountryNpp/queryvalue?country=" + this.$props.country + "&year=" + this.$props.year;
      http.getRequest(url, params).then(res => {
        if (this.valuesOfprompt.length != 0) {
          this.valuesOfprompt.length = 0;
        }
        this.valuesOfprompt.push(res[this.$props.country].maxValue);
        this.valuesOfprompt.push(res[this.$props.country].minValue);
        this.valuesOfprompt.push(res[this.$props.country].avgValue);
        this.valuesOfprompt.push(res[this.$props.year.toString()].maxValue);
        this.valuesOfprompt.push(res[this.$props.year.toString()].minValue);
        this.valuesOfprompt.push(res[this.$props.year.toString()].avgValue);
      }, err => {
        console.log(err);
      })
    }
  }
};
</script>

<style scoped>

.item {
  padding: 18px 0;
  width: 300px;
  font-size: 14px;
  color: black;
}
</style>